<!doctype html>
<html>

	<head>
		<meta charset="utf-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link rel="stylesheet" type="text/css" href="../../../css/mui.min.css"/>
		<link rel="stylesheet" type="text/css" href="../../../css/pages/home/miantain.css"/>
	</head>

	<body>
		<div class="loading-warpper" id="loading">
			<div class="loading">
				<div class="item1"></div>
				<div class="item2"></div>
			</div>
		</div>
		<div id="app" class="detail">
			<!-- 轮播图 -->
			<div class="detail-img">
				<img :src="detailData.path" >
			</div>
			
			<div class="desc">
				<div class="name" v-text="detailData.lawhName"></div>
				<div class="detailed">
					<span class="price" v-text="detailData.lawhPriceUnit"></span>
					<span class="font-12 font-c-7f" v-text="'已服务' + detailData.lawhServeNumber + '人' "></span>
				</div>
				<div class="contact">
					<div class="map font-14 font-c-7f">
						<img src="../../neighbor/images/location.png" >
						<span v-text="detailData.lawhDetails"></span>
					</div>
					<div class="ipone" @click="subscribeClick(detailData.lawhPhone)">
						<img src="../../neighbor/images/details/ipone.png" >
					</div>
				</div>
			</div>
			<!-- 介绍 -->
			<div class="presentation">
				<div class="title font-14 font-c-min">
					<img src="../../../images/home/service/jieshao.png" >介绍</div>
				<div class="detail">
					<p v-text="detailData.lawhIntroduce">
					</p>
				</div>
			</div>
			<!-- 底部按钮 -->
			<div class="bottom-btn">
				<div class="collect" @click="collectTap(detailData.isCollecting)">
					<!-- <img class="collect-icon" src="../../neighbor/images/details/shou_no.png" > -->
					<img class="collect-icon" :src="detailData.isCollecting==0?'../../neighbor/images/details/shou_no.png' : '../../neighbor/images/details/shou.png' " > 
					<span v-text="detailData.isCollecting==0?'加入收藏':'已收藏'"></span>
				</div>
				<div class="relation" @click="subscribeClick(detailData.lawhPhone)">立即预约</div>
			</div>
		</div>
		
		<script src="../../../js/Width.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../../js/mui.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../../js/vue.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../../js/Util.js" type="text/javascript" charset="utf-8"></script>
		<script src="https://cdn.bootcss.com/fastclick/1.0.6/fastclick.min.js"></script>
		<script type="text/javascript">
			mui.init({
				beforeback: function() {
					//获得列表界面的webview
					var list = plus.webview.currentWebview().opener();
					//触发列表界面的自定义事件（refresh）,从而进行数据刷新
					mui.fire(list, 'collectCallback');
					//返回true，继续页面关闭逻辑
					return true;
				}
			})
			mui.plusReady(function(){
				if (!mui.os.android) {
					FastClick.attach(document.body);
				}
				var self = plus.webview.currentWebview();
				var lawhID = self.detailID;
				GetLawHallDetails(lawhID)
				self.setPullToRefresh({
					support: true,
					height: '50px',
					range: '200px',
					contentdown: {
						caption: '下拉可以刷新'
					},
					contentover: {
						caption: '释放立即刷新'
					},
					contentrefresh: {
						caption: '正在刷新...'
					}
				}, function() {
					GetLawHallDetails(lawhID)
					mui.toast('刷新成功')
					self.endPullToRefresh();
				});
			})
			
			function GetLawHallDetails (lawhID) {
				mui.post(Util.HTTP + 'api/LawHall/GetLawHallDetails',{
					userID: Util.getState('$state').userID,
					lawhID: lawhID
				},function(res){
					if(res.code==1001){
						App.detailData = res.data
						document.getElementById('loading').style.display = 'none'
					}else {
						mui.toast(res.message)
					}
				})
			}
			
			var App = new Vue({
				el: '#app',
				data: {
					detailData: {}
				},
				methods: {
					collectTap: function (type) {
						var id = this.detailData.lawhID
						if (type == 0) {
							this.detailData.isCollecting = 1
							Util.AddCollecting(id, "LawHall")
						} else if (type == 1) {
							this.detailData.isCollecting = 0
							Util.CancelCollecting(id, "LawHall")
						}
					},
					subscribeClick: function (lawhPhone) {
						plus.nativeUI.confirm("本平台仅提供跟商家的联系方式，需自行跟商家电话预约", function (e) {
							if (e.index == 0) {
								plus.device.dial(lawhPhone, false);
							}
						})
					}
				}
			}) 
		</script>
	</body>
</html>
